<template>
	<view>
		<view class="grid-box">
			<view class="u-p-b-20 u-flex">
				<u-avatar :src="form.icon" mode="square"></u-avatar>
				<view class="u-flex-1 u-p-l-30">
					<view class="address">
						<text class="u-font-32 u-p-r-20">{{form.name}}</text>
						<!-- 表示启用冻结 -->
						<!-- <u-tag v-if="form.usestate == '已启用'" text="启用中" type="success" size="mini"/>
						<u-tag v-else text="已冻结" type="error" size="mini"/> -->
						<!-- 表示营业状态 -->
						<u-tag v-if="form.ismanage" text="营业中" type="success" size="mini"/>
						<u-tag v-else text="已闭店" type="error" size="mini"/>
					</view>
					<view class="u-p-t-8">
						<view class="u-flex u-font-24">
							<text class="u-font-24 u-tips-color">所属加盟商：{{form.franchisename}}</text>
						</view>
					</view>
				</view>
			</view>
			
			<view class="bottom u-border-top u-p-t-20">
				<view>
					<text class="u-font-24 u-tips-color">地址：{{form.address.address}}</text>
				</view>
				<view>
					<text class="u-font-24 u-tips-color">所属地区：{{form.address.citynames}}</text>
				</view>
				<view>
					<text class="u-font-24 u-tips-color">营业时间：{{form.servicetime}}</text>
				</view>
			</view>
			
			<view class="u-flex u-m-t-30">
				<u-button class="u-flex-1 u-m-r-30" size="medium" @click="editStore(id)"><u-icon name="edit-pen-fill"></u-icon>修改站点信息</u-button>
				<u-button class="u-flex-1" size="medium" @click="setManageState(form.ismanage)"><u-icon name="setting-fill"></u-icon>{{ form.ismanage?'设置站点关闭':'设置站点营业' }}</u-button>
				<!-- <u-button class="u-flex-1" size="medium" @click="setState(form.usestate)"><u-icon name="setting-fill"></u-icon>{{ form.usestate == '已启用'?'冻结站点':'启用站点' }}</u-button> -->
			</view>
		</view>
		<view class="u-tabs-box">
			<u-tabs-swiper activeColor="#10beca" ref="tabs" :list="list" :current="current" @change="change" :is-scroll="false" swiperWidth="750">
			</u-tabs-swiper>
		</view>
		
		<view v-if="current == 0" class="u-border-top">
			<inventory :sendStoreId="id"></inventory>
		</view>
		<view v-if="current == 1" class="u-border-top">
			<staffList :sendStoreId="id"></staffList>
		</view>
		<view v-if="current == 2" class="u-border-top">
			<incomeUserList :sendStoreId="id"></incomeUserList>
		</view>
		<view v-if="current == 3" class="u-border-top">
			<incomeList :sendStoreId="id"></incomeList>
		</view>
		<view v-if="current == 4" class="u-border-top">
			<outboundList :sendStoreId="id"></outboundList>
		</view>
	</view>
</template>

<script>
	import staffList from '@/pages/shop/staff/staff'
	import inventory from '@/pages/shop/statistics/inventory/inventory'
	import incomeList from '@/components/order/store-in-order.vue'
	import outboundList from '@/components/order/store-out-order.vue'
	import incomeUserList from '@/components/order/store-order.vue'
	export default {
		components:{
			staffList,
			inventory,
			incomeList,
			outboundList,
			incomeUserList
		},
		data() {
			return {
				id: 0,
				form:{
					address:{}
				},
				list: [
					{
						value: 0,
						name: '站点库存'
					},
					{
						value: 1,
						name: '店员管理'
					},
					{
						value: 4,
						name: '回收订单'
					},
					{
						value: 2,
						name: '入库订单'
					},
					{
						value: 3,
						name: '出库订单'
					}
				],
				current: 0,
			}
		},
		onLoad(option) {
			this.id = option.id
			this.getDetails()
		},
		methods: {
			getDetails(){
				this.$u.get('/Store/Details?id=' + this.id).then((res) => {
					this.form = res
				}).catch(() => {
					
				})
			},
			editStore(id){
				uni.navigateTo({
					url:'/pages/shop/my/create/create?id='+id
				})
			},
			// tab栏切换
			change(index) {
				this.current = index;
			},
			// 设置站点营业状态
			setManageState(ismanage){
				let tipsTxt = ''
				if (!ismanage) {
					tipsTxt = '此操作将开启站点, 是否继续?'
				} else {
					tipsTxt = '此操作将关闭站点, 是否继续?'
				}
				
				uni.showModal({
					content: tipsTxt,
					success: (res)=> {
						if (res.confirm) {
							this.$u.get('/Store/SetManage', { storeId: this.id, isManage: !ismanage }).then(res => {
								console.log(res)
								uni.showToast({
									title: '操作成功'
								})
								this.getDetails()
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				})
			},
			// 设置站点启用冻结
			setState(value) {
				let usestate = ''
				let tipsTxt = ''
				if (value == '已冻结') {
					usestate = 2
					tipsTxt = '此操作将启用站点, 是否继续?'
				} else {
					usestate = 1
					tipsTxt = '此操作将冻结站点, 是否继续?'
				}
				
				uni.showModal({
					content: tipsTxt,
					success: (res)=> {
						if (res.confirm) {
							this.$u.post('/Store/SetState', { ids: [this.id], state: usestate }).then(res => {
								console.log(res)
								uni.showToast({
									title: '操作成功'
								})
								this.getDetails()
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.grid-box{
		margin: 0;
		border-radius: 0;
	}

</style>
